// pages/mytrain/generateReports/generateReports.js
var utils = require('../../../utils/util.js');
var httpUrl = getApp().globalData.httpUrl;
Page({

    /**
     * 页面的初始数据
     */
    data: {
        canvasHidden: false, //设置画板的显示与隐藏，画板不隐藏会影响页面正常显示
        avatarUrl: '', //用户头像
        nickname: '', //用户昵称
        thumb: "",
        num: "",
        rwm: "",
        name: "",
        description: "我已生成二维码～", //奖品描述
        // FilePath: 'https://avatar.csdn.net/A/9/D/3_rolan1993.jpg', //头像路径

    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad: function(options) {
        var that = this;
        that.setData({
            date: options.date,
            typeid: options.typeid,
            avatarUrl: that.data.avatarUrl
        })
     
        //获取用户设备信息，屏幕宽度
        wx.getSystemInfo({
            success: res => {
                that.setData({
                    screenWidth: res.screenWidth
                })
            }
        })
        that.userPersonal();
        that.getcodeTap();
        utils.http(httpUrl + "/mobile/member/train_share", {
            typeid: options.typeid,
            date: options.date
        }, function(res) {
            if (res.state == 1) {
                that.setData({
                    num: res.datas.amount,
                    name: res.datas.name,
                    thumb: res.datas.thumb
                });
                wx.getImageInfo({
                    src: res.datas.thumb,
                    success: function(res) {
                        console.log(res);
                        that.setData({
                            thumb: res.path
                        })
                    }
                })
            } else {
                utils.message(res.datas);
            }
        })
    },
    //用户详情
    userPersonal: function(e) {
        var that = this;
        utils.http(httpUrl + "/mobile/member/member_info", {}, function(res) {
            if (res.state == 1) {
                that.setData({
                    avatarUrl: res.datas.avatar,
                    nickname: res.datas.nickname

                });
                wx.getImageInfo({
                    src: res.datas.avatar,
                    success: function(res) {
                        console.log(res);
                        that.setData({
                            avatarUrl: res.path
                        })
                    }
                })
            } else {
                utils.message(res.datas);
            }
        })
    },
    //二维码
    getcodeTap: function(e) {
        var that = this;
        utils.showLoading();
        utils.http(httpUrl + "/mobile/common/getcode", {
            type: that.data.typeid,
            date: that.data.date
        }, function(res) {
            utils.hideLoading();
            if (res.state == 1) {
                that.setData({
                    rwm: res.datas
                });
                wx.getImageInfo({
                    src: res.datas,
                    success: function(res) {
                        console.log(res);
                        that.setData({
                            rwm: res.path
                        })
                    }
                })
            } else {
                utils.message(res.datas);
            }
        })
    },
    //定义的保存图片方法
    saveImageToPhotosAlbum: function() {
        var that = this;
        that.setData({
            canvasHidden: true
        })
        wx.showLoading({
            title: '保存中...',
        })
        //设置画板显示，才能开始绘图
        var unit = that.data.screenWidth / 375;
        var butback = "/images/butBack.png";
        var butsize = "/images/butsize.png";
        var avatarUrl = that.data.avatarUrl;
        var nickName = that.data.nickname + "小朋友";
        var thumb = that.data.thumb;
        var num = that.data.num + "个" + that.data.name + "运动";
        var rwm = that.data.rwm;
        var description = that.data.description;
        var context = wx.createCanvasContext('share');
            context.drawImage(butback, 0, 0, unit * 375, unit * 462.5), 
            context.drawImage(butsize, unit * 90, unit * 70, unit * 210, unit * 15),  
            // context.save(); // 先保存状态 已便于画完圆再用        
            // context.beginPath(); //开始绘制        
            // //先画个圆        
            // context.arc(100, 70, 80, 0, Math.PI * 2, false);
            // context.clip();
            //画了圆 再剪切  原始画布中剪切任意形状和尺寸。一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内
            context.drawImage(avatarUrl, unit * 160, unit * 108, unit * 55, unit * 55),
           // context.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制
            context.drawImage(thumb, unit * 160, unit * 220, unit * 50, unit * 50),
            context.drawImage(rwm, unit * 155, unit * 324, unit * 55, unit * 55),
            context.setFontSize(16),
            context.setTextAlign('center'),
            context.fillText(nickName, unit * 186, unit * 188),
            context.setFontSize(16),
            context.setTextAlign('center'),
            context.fillText(num, unit * 186, unit * 298),
            context.setFontSize(16),
            context.setTextAlign('center'),
            context.fillText(description, unit * 186, unit * 410),
            //把画板内容绘制成图片，并回调 画板图片路径
            context.draw(false, function() {
                wx.canvasToTempFilePath({
                    x: 0,
                    y: 0,
                    width: unit * 375,
                    height: unit * 462.5,
                    destWidth: unit * 375,
                    destHeight: unit * 462.5,
                    canvasId: 'share',
                    success: function(res) {
                        that.setData({
                            shareImgPath: res.tempFilePath
                        })
                        if (!res.tempFilePath) {
                            wx.showModal({
                                title: '提示',
                                content: '图片绘制中，请稍后重试',
                                showCancel: false
                            })
                        }
                        //画板路径保存成功后，调用方法吧图片保存到用户相册
                        wx.saveImageToPhotosAlbum({
                            filePath: res.tempFilePath,
                            //保存成功失败之后，都要隐藏画板，否则影响界面显示。
                            success: (res) => {
                                //  console.log(res)
                                wx.hideLoading()
                                that.setData({
                                    canvasHidden: true
                                })
                            },
                            fail: (err) => {
                                // console.log(err)
                                wx.hideLoading()
                                that.setData({
                                    canvasHidden: true
                                })
                            }
                        })
                    }
                })
            });


    }
})